<template>
  <div>
    <TitleStyle title="推荐歌单"/>
    <div v-if="list">
      <RecommendThePlaylist :list="list"/>
    </div>
    <van-empty v-else description="暂无推荐歌单"/>
    <TitleStyle title="最新音乐"/>
    <div v-if="newMusicList">
      <NewMusic :newMusicList="newMusicList" :isshow="false"/>
    </div>
    <van-empty v-else description="暂无推荐歌单"/>
    <div style="height: 100px"></div>
  </div>
</template>

<script>
import TitleStyle from "../../../components/TitleStyle.vue"
import RecommendThePlaylist from "../../../components/RecommendThePlaylist.vue";
import NewMusic from "../../../components/NewMusic.vue"
import {getNewMusic, getRecommendThePlaylist} from "@/api/index-api";


export default {
  name: "RecommendMusic",

  components: {
    TitleStyle,
    RecommendThePlaylist,
    NewMusic
  },
  data() {
    return {
      list: null, // 推荐歌单
      newMusicList: null,  //  最新音乐
    }
  },
  created() {
    //  请求推荐歌单
    // this.axios.get(`/music-api/personalized?limit=${6}`).then((res) => {
    //   // console.log(res.data)
    //   if (res.data.code === 200) {
    //     this.list = res.data.result
    //   }
    // })
    getRecommendThePlaylist().then((res) => {
      // console.log(res)
      if (res.code === 200) {
            this.list = res.result
          }
    })

    //  请求最新歌单
    // this.axios.get(`http://showme.myhope365.com/music-api/personalized/newsong?limit=${8}`).then((res) => {
    //   if (res.data.code === 200) {
    //     console.log(res.data)
    //     this.newMusicList = res.data.result
    //   }
    // })
    getNewMusic().then((res)=>{
      // console.log(res)
      if (res.code === 200) {
            this.newMusicList = res.result
          }
    })
  }
//   component:{
//     TitleStyle,
//     RecommendThePlaylist
// }
}
</script>

<style scoped>

</style>